// webpack 是 node 写出来的 node 的写法

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    devServer: { // 开发服务器的配置
        port: 3000,
        progress: true,
        contentBase: './build',
        open: true, // 自动打开浏览器
        compress: true, // gzip 压缩
    },
    mode: 'production',// 模式 默认两种 production development
    entry: './src/index.js',//  入口
    output: {
        filename: 'bundle.[hash:8].js', // 打包后文件名 加 hash 防止缓存
        path: path.resolve(__dirname, 'build'), // 路径必须是一个绝对路径
    },
    plugins: [ // 数组 防止所有 webpack 插件
        new HtmlWebpackPlugin({
            template: "./src/index.html", // 模版文件位置
            filename: "index.html", // 打包后的名字
            minify: { // 压缩 index.html
                removeAttributeQuotes: true, // 删除属性的双引号
                collapseWhitespace: true, // 删除空格 压缩为一行
            },
            hash: true, // 加上 hash 串 防止系统缓存引起的 页面不更新
        })
    ]
};